import React from 'react';
import { Form, Button, Icon, Input } from 'antd';
import './login.less';
import $ from 'jquery';
import Config from '../common/config';
const config = new Config();
const FormItem = Form.Item;


class LoginComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      expression: '', //
      confirmDirty: false, //
    }
  }

  componentDidMount() {
  }

  //提交登录表单
  handleSubmit(e) {
    e.preventDefault();
    this.props.form.validateFields((err, values) => {
      if (!err) {
        $.ajax({
          url: config.Priviliege + '/login/login',
          type: "post",
          async: true,
          // ip: returnCitySN.cip 
          data: { userName: values.userName, password: values.password },
          success: res => {
            console.log(res)
            if (res.code === 200) {
              console.log(res)
              const user = res.usr;
              const token = res.token;
              sessionStorage.setItem("UserInfo", JSON.stringify(user)); //用户信息
              sessionStorage.setItem('token', token); //token
              const url = sessionStorage.getItem('url')
              if (url) {
                sessionStorage.removeItem('url')
                return location.href = url
              }
              window.location.href = './index.html';
            } else {
              this.props.form.setFields({
                // userName: { value: values.userName, errors: [new Error(res.mes)] },
                password: { value: values.password, errors: ['用户名不存在或密码错误!'] }
              })
            }
          }
        });
      }
    });
  }
  render() {
    const { getFieldDecorator } = this.props.form;
    return (
      <div className="bajsa">
        <div className="kuanz">
          <div className="kuanz1">
            <div className="logo">
              <img src="src/images/logo.png" alt="" />
            </div>
            <div className="biaodian">
              <Form onSubmit={this.handleSubmit.bind(this)} className="login-form">
                <FormItem className="formItem loginInput" style={{ height: 65, marginBottom: 20 }}>
                  <div className={"thrt"}>用户名</div>
                  {getFieldDecorator('userName', {
                    rules: [{ required: true, whitespace: true, message: '请输入正确的用户名' }],
                  })(
                    <Input prefix={<Icon type="user" className={"bianz"} />} placeholder="请输入用户名" name="userName" />
                  )}
                </FormItem>
                <FormItem className="formItem loginInput" style={{ height: 65, marginBottom: 20 }}>
                  <div className={"thrt"}>密码</div>
                  {getFieldDecorator('password', {
                    rules: [{ required: true, message: '请输入正确的密码' }],
                  })(
                    <Input type="password" prefix={<Icon type="lock" className={"bianz"} />} placeholder="请输入密码" />
                  )}
                </FormItem>
                <FormItem>
                  <Button type="primary" htmlType="submit" className="login-form-button denlu">登录</Button>
                </FormItem>
              </Form>
            </div>
          </div>
        </div>
      </div>
    )
  }
}
const Login = Form.create()(LoginComponent);
export default Login;
